<!-- INCLUDE header.html -->

<div id="riest-content">
	<div class="navigator-list">
		<div class="list-panel-top">
			<li>{$parent.name}</li>
		</div>
		<ul class="list-panel-item">
			{foreach($children as $c)}
			<li><a href="{category_link($c)}">{$c.name}</a></li>
			{/foreach}
		</ul>
		<div class="list-panel-bottom">
		</div>
	</div>
	<div class="article">
		<h1 class="article-title">{$a.name}</h1>
		<div class="article-sub-title">发布日期：{date('Y年m月d日',strtotime($a['publish_time']))}</div>
		{if($a.is_photo)}
		<?php
		//从内容中把图片取出来
		
		$s = $a['content'];
		preg_match_all('/<img\s[^>]+>/i',$s,$ms);
		$imgs = array();
		foreach($ms[0] as $img)
		{
			preg_match('/src\=([\'\"])([^\'\"]+)\1/i',$img,$_ms);
			$imgs[] = $_ms[2];
			$s = str_replace($img,'<!--split-->',$s);
		}

		$arr = explode('<!--split-->',$s);
		$texts = array();
		for($i=1;$i<count($arr);$i++)
		{
			$texts[] = strip_tags($arr[$i],'<span><br><font>');
		}
		?>
			<div class="article-images">
				<div id="article-image-wrap" style="text-align:center;">
					<img />
				</div>
					<a class="prev browse left"></a>
					<div class="scrollable" style="display:block;width:550px;">   
						<div class="items"> 
							<?php
							for($i=0,$len=count($imgs);$i<$len;$i+=4)
							{
								echo '<div>';
								for($j=$i;$j<=$i+4 && $j<$len;$j++)
								{
							 		echo '<img orig="'.$imgs[$j].'" alt="'.htmlspecialchars($texts[$j]).'" src="'.thumb($imgs[$j],100,75).'" />';
								}
								echo '</div>';
							}
							?>
						</div>
					</div> 
					<a class="next browse right"></a> 
					<br clear="all">
					
					<div id="photo-desc" class="article-images-description">
					图片描述
					</div>
			</div>
			<link type="text/css" rel="stylesheet" href="css/scrollable-horizontal.css"/>
			<link type="text/css" rel="stylesheet" href="css/scrollable-buttons.css"/>
			<script src="js/jquery.tools.min.js"></script>
			<script>
				var url = $(this).attr("alt");
				$(function() {    
					$(".scrollable").scrollable({step:4});

					$(".items img").click(function() {
						if ($(this).hasClass("active")) { return; }
						var url = $(this).attr("orig");
						var desc = $(this).attr('alt');
						$('#photo-desc').html(desc);
						var wrap = $("#article-image-wrap").fadeTo("medium", 0.5);
						var img = new Image();
						img.onload = function() {
							wrap.fadeTo("fast", 1);
							wrap.find("img").attr("src", url);
						};
						img.src = url;
						$(".items img").removeClass("active");
						$(this).addClass("active");
						
					}).filter(":first").click();
				});
			</script>
		{else}
			<div class="article-content">{$a.content}</div>
		{/if}
	</div>
	
	<div style="clear: both;background-color: white;"></div>
</div>

<!-- INCLUDE footer.html -->